<template>
  <a-flex
    v-for="x in rights"
    v-bind:key="x.key"
    gap="small"
    style="margin-top: 8px"
  >
    <a-select
      v-model:value="x.T"
      style="width: 200px"
      placeholder="规则类型"
      :disabled="props.readonly"
    >
      <a-select-option
        v-for="y in appStore.arySrmType"
        :key="y.key"
        :value="y.key"
        >{{ y.label }}
      </a-select-option>
    </a-select>
    <span v-if="x.T != 'SrmRecMax'">
      <a-select
        v-if="x.T == 'VrVisitor'"
        v-model:value="x.uId"
        style="width: 200px"
        :placeholder="$t('128')"
      >
        <a-select-option
          v-for="item in appStore.otherUsers"
          :key="item.id"
          :value="item.id"
        >
          {{ item.name }}
        </a-select-option>
      </a-select>
      <span>可见<a-switch v-model:checked="x.canSee" /></span>
      <span
        >可修改<a-switch
          v-model:checked="x.canEdit"
          :disabled="CommonDefine.useful(channel.selectedModel.store)"
      /></span>
      <span
        >可删除<a-switch
          v-model:checked="x.canDelete"
          :disabled="CommonDefine.useful(channel.selectedModel.store)"
      /></span>
    </span>
    <span v-else
      ><a-input-number v-model:value="x.recMax" style="width: 80px" />
    </span>
    <a-button
      v-if="!props.single && !props.readonly"
      type="link"
      @click="removeRight(x.key)"
      danger
      title="删除规则"
      ><DeleteOutlined
    /></a-button>
  </a-flex>
  <div v-if="!props.single && !props.readonly">
    <a-button type="link" @click="addRight">增加规则</a-button>
  </div>
</template>
<script setup>
import { reactive } from "vue";
import CommonDefine from "@/component/CommonDefine";
import { DeleteOutlined } from "@ant-design/icons-vue";

const appStore = CommonDefine.appStore();
const channel = CommonDefine.channel();
const props = defineProps({
  single: { type: Boolean, defalt: false },
  readonly: { type: Boolean, defalt: false },
});
const rights = reactive([
  { key: 1, T: "", canSee: true, canEdit: false, canDelete: false },
]);

const addRight = () => {
  let right = {
    key: rights.length + 1,
    T: "",
    canSee: true,
    canEdit: false,
    canDelete: false,
  };
  rights.push(right);
};

const removeRight = (key) => {
  let idx = rights.findIndex((item) => key === item.key);
  rights.splice(idx, 1);
};

const getRules = () => {
  return rights;
};

const setRules = (newValue) => {
  CommonDefine.clearArray(rights);
  let itemKey = 0;
  newValue.forEach((x) => {
    itemKey++;
    x.key = itemKey;
    if (x.T != "SrmRecMax") {
      let offSet = 0;
      if (x.T == "VrVisitor") {
        offSet = 1;
        x.uId = x.C[0];
      }
      x.canSee = x.C[offSet];
      x.canEdit = x.C[offSet + 1];
      x.canDelete = x.C[offSet + 2];
    } else {
      x.recMax = x.C;
    }
    rights.push(x);
  });
};

defineExpose({ getRules, setRules });
</script>
